@extends('PShop::layout')
@push('styles')
    <link href="{{asset(config('view.plugin').'/layui/css/layui.css')}}" rel="stylesheet">
@endpush
@section('content')
    <section class="wapper">
        <div class="base-w">
            <div class="">
                <ol class="am-breadcrumb am-margin-bottom-0 am-padding-top-sm am-padding-bottom-sm">
                    <li><a href="{{route('f_Shop_index')}}">首页</a></li>
                    <li class="am-active"><a href="#">购物车</a></li>
                </ol>
            </div>
            <div data-am-widget="tabs" class="am-tabs am-tabs-d2 am-margin-0">
            <ul class="am-tabs-nav am-cf mui-fenlei">
                <!--此处不建议加 a 标签，禁用框架自带tab切换效果-->
                @foreach(config('shop.zone') as $key=>$title)
                <li style="cursor: pointer" class="flex-item {{$key == $zone ?'am-active':''}}"  data-url = "{{route('f_Pc_Cart_cartList',['zone'=>$key])}}">{{$title}}</li>
                @endforeach
            </ul>

            @if($list->isNotEmpty())
                <form method="post" action="{{route('f_Pc_Order_buyCart',['zone'=>$zone])}}">
                    {{csrf_field()}}
                    <div class="cart-box">
                <div class="am-scrollable-horizontal shopCar-list-data am-bg-white">
                    <table class="am-table am-text-nowrap">
                        <thead>
                        <tr>
                            <th class="am-padding-left">
                                <label class="am-checkbox am-danger am-margin-0">
                                    <input type="checkbox" class="check-all" data-box="cart-box"  data-am-ucheck> 全选
                                </label>
                            </th>
                            <th>商品名称</th>
                            <th class="am-text-center">单价</th>
                            <th class="am-text-center">数量</th>
                            <th class="am-text-center">小计</th>
                            <th class="am-text-center">操作</th>
                        </tr>
                        </thead>
                        <tbody>
                        @foreach($list as $item)
                        <tr id="cart-item-{{$item->id}}">
                            <td class="am-padding-left">
                                <label class="am-checkbox am-danger am-inline-block">
                                    <input type="checkbox" class="check-item"
                                           data-box="cart-box"
                                           data-price="{{$item->price}}"
                                           name="cart_id[]"
                                           value="{{$item->id}}" data-am-ucheck>
                                </label>
                                <span><img src="{{str_first($item->goods->goods_images)}}"></span>
                            </td>
                            <td><div class="am-line2">
                                    {{$item->goods->goods_name}}
                                    <em class="am-padding-left-xs">
                                        {{spec_title($item->goods_specs,$item->goods_id)}}
                                    </em>
                                </div>
                            </td>
                            <td class="am-text-center">{{$item->price}}元</td>
                            <td>
                                <div class="am-input-group  buy-num">
                                    <span class="am-input-group-label num-dec"><em class="am-icon-minus"></em></span>
                                    <input type="text" name="number" class="am-form-field am-text-center" readonly
                                           value="{{$item->num}}"
                                           data-id="{{$item->id}}"
                                           data-price="{{$item->price}}"
                                           data-async="{{route('f_Pc_Cart_update',['cart_id'=>$item->id])}}"
                                    >
                                    <span class="am-input-group-label num-add"><em class="am-icon-plus"></em></span>
                                </div>
                            </td>
                            <td class="am-text-danger am-text-center item-total">{{$item->total_price}}</td>
                            <td class="am-text-center">
                                <em style="cursor: pointer;" class="cart-del am-icon-trash am-text-xl"
                                    data-id="{{$item->id}}"
                                    data-url="{{route('f_Pc_Cart_delete',['cart_id'=>$item->id])}}">
                                </em>
                            </td>
                        </tr>
                        @endforeach
                        </tbody>
                    </table>
                </div>
                <div class="am-margin-top am-g am-text-xs am-bg-white jiesuan-eara">
                    <div class="am-u-md-4 am-u-lg-4 am-padding-right-0">
                        <span> <label class="am-checkbox-inline am-danger am-margin-0">
                                    <input type="checkbox" class="check-all" data-box="cart-box" data-am-ucheck > 全选
                                </label>
                        </span>
                        <span><a data-url="{{route('f_Pc_Cart_delete')}}" id="cart-del-all" >删除</a></span>
                        <span class="am-padding-left-xs am-padding-right-xs">|</span>
                        <span><a href="javascript:;" data-url="{{route('f_Pc_Cart_clearAll')}}" id="cart-clear">清空购物车</a></span>
                    </div>
                    <div class="am-u-md-84 am-u-lg-4 am-padding-right-0">
                        <span>共<i class="am-text-danger am-padding-left-xs am-padding-right-xs">{{$goods_num}}</i>件商品，已选择<i class="am-text-danger am-padding-left-xs am-padding-right-xs" id="cart-select-num">0</i>件</span>
                    </div>
                    <div class="am-u-md-4 am-u-lg-4 am-padding-right-0" style="">
                        <div class="am-u-md-6 am-u-lg-6 am-padding-0 am-text-danger">合计(不含运费)：<i class="am-text-lg am-blod" id="total-money">0</i>元</div>
                        <div class="am-u-md-6 am-u-lg-6 am-padding-0 am-text-center am-btn-danger">
                            <a href="javascript:;" class="am-text-white am-text-lg" onclick="createOrder(this);"  data-action="{{route('f_Pc_Order_buyCart')}}">去结算</a>
                        </div>
                    </div>
                </div>
            </div>
                </form>
            @else
            <!--购物车为空-->
                <div class="am-bg-white am-g am-text-center empty-uinn">
                    <div class="am-padding-bottom-sm"><img src="{{asset(config('mall.pc_assets').'/detail/img/shopcarEmpty.png')}}"></div>
                    <div class="am-link-muted am-padding-bottom-sm">购物车还是空的</div>
                    <div><a href="{{route('f_Shop_index')}}" class="am-btn am-btn-danger am-radius">继续逛</a></div>
                </div>
            @endif
        </div>
        </div>
    </section>
@endsection
@push('scripts')
    <script src="{{asset(config('mall.pc_assets').'/js/cart.js')}}"></script>
    <script>
        $(document).ready(function(){
            eventBuyNum();
            removeGoods();
        })
    </script>

    <script>
        $('.mui-fenlei .flex-item').each(function () {
            $(this).off('tap').on('click',function () {
                window.location.href =  $(this).data('url');
            });
        });
    </script>

@endpush